import React from 'react'
import {Text, View,Button} from '@tarojs/components'
import {AtAvatar, AtButton, AtList, AtListItem} from 'taro-ui';
import Taro from "@tarojs/taro"
import userStore from "../../store/userStore";
import './index.scss'


export default () => {
  const {useStore} = userStore
  const userInfo = useStore(state => state.value)
  return <View>
    <View className='bg'>
      <View className='bg-box at-row at-row__align--center'>
        <View className='at-col-3'>
          {
            userInfo?.isLogin ?
              <AtAvatar image={userInfo?.avatarUrl} circle /> : <AtAvatar text='空' circle />
          }
        </View>
        <View className='at-col-9' onClick={() => {
          if(userInfo?.isLogin) return
          Taro.navigateTo({
            url: "/pages/login/index"
          })
        }}
        >{
          userInfo?.isLogin ? <View><Text>{userInfo.nickName}</Text></View> : <View><Text>登录/注册</Text></View>
        }
        </View>
      </View>
    </View>
    {/*  menus*/}


    <View style={{marginTop: "80px"}} className='cc'>
      <View className='ccc'>
        <Button openType='feedback'>意见反馈</Button>
        <Button openType='contact'>客服咨询</Button>
      </View>
      <AtList>
        <AtListItem
          title='意见反馈'
          arrow='right'
          thumb='https://img12.360buyimg.com/jdphoto/s72x72_jfs/t6160/14/2008729947/2754/7d512a86/595c3aeeNa89ddf71.png'
        />
        <AtListItem
          title='客服咨询'
          arrow='right'
          thumb='http://img10.360buyimg.com/jdphoto/s72x72_jfs/t5872/209/5240187906/2872/8fa98cd/595c3b2aN4155b931.png'
        />
        <AtListItem
          title='关于我们'
          arrow='right'
          thumb='http://img12.360buyimg.com/jdphoto/s72x72_jfs/t10660/330/203667368/1672/801735d7/59c85643N31e68303.png'
          onClick={()=>Taro.navigateTo({url:"/pages/aboutUs/index"})}

        />
      </AtList>
    </View>



    <View className='wing-blank' style={{marginTop: "30px"}}>
      {
        userInfo?.isLogin ?
          <AtButton type='secondary' onClick={() => userStore.dispatch("clear")}>退出登录</AtButton>
          : null
      }
    </View>
  </View>
}
